<template>
    <div class="list_page_div">
        <page-list :loading="loading" :table-config="tableConfig" :data-list="dataList" :height="height" show-index
                   show-page :total="total" :currentPage="param.pageNum" :pageSize="param.pageSize" @currentChange="handleCurrentChange"
                   show-operate operate-width="160">
            <template #searchArea>
                <select-option v-model="param.typeId" select-width="200px" :list="typeList"></select-option>
                <el-button type="primary" @click="searchList">查询</el-button>
                <el-button type="primary" @click="resetData">重置</el-button>
                <el-button type="primary" @click="editData()" v-if="powerList.indexOf('newsArticle:insert')>-1">新增</el-button>
                <el-button type="primary" @click="editType">文章目录</el-button>
            </template>

            <template #item_imagePath="scope">
                <img :src="$store.state.fileURL + scope.row.imagePath" height="30px" alt=""/>
            </template>
            <template #item_releaseFlag="scope">
                {{ $common.getDicName('yesNo', scope.row.releaseFlag) }}
            </template>

            <template #operateContent="scope">
                <el-button type="text" @click="editDetial(scope.row.id)" v-if="scope.row.releaseFlag!=0">查看</el-button>
                <el-button type="text" @click="editData(scope.row.id)" v-if="scope.row.releaseFlag==0&&powerList.indexOf('newsArticle:update')>-1">编辑</el-button>
                <el-popconfirm title="是否确定删除当前数据？" @confirm="delData(scope.row.id)" v-if="scope.row.releaseFlag==0&&powerList.indexOf('newsArticle:delete')>-1">
                    <el-button slot="reference" type="text">删除</el-button>
                </el-popconfirm>
                <el-button type="text" @click="releaseData(scope.row.id)" v-if="scope.row.releaseFlag==0&&powerList.indexOf('newsArticle:release')>-1">发布</el-button>
                <el-button type="text" @click="revokeData(scope.row.id)" v-if="scope.row.releaseFlag==1&&powerList.indexOf('newsArticle:revoke')>-1">撤回</el-button>
            </template>
        </page-list>
        <!--编辑-->
        <news-article-edit :visible.sync="showEdit" :id="id" @refreshList="searchList"></news-article-edit>
        <news-article-detail :visible.sync="showDetail" :id="id" @refreshList="searchList"></news-article-detail>
    </div>
</template>

<script>
import PageList from "@/components/grid/pageList.vue";
import SelectOption from "@/components/select/selectOption.vue";
import NewsArticleEdit from "@/views/system/news/newsArticle/component/newsArticleEdit.vue";
import NewsArticleTypeLis from "@/views/system/news/newsArticle/component/newsArticleTypeLis.vue";
import NewsArticleDetail from "@/views/system/news/newsArticle/component/newsArticleDetail.vue";

export default {
    name: "newsArticleList",
    components: {NewsArticleDetail, NewsArticleTypeLis, NewsArticleEdit, SelectOption, PageList},
    data() {
        return {
            height: 300,
            loading: false,
            showEdit: false,
            showDetail: false,

            id: '',
            tableConfig: [
                {label: "目录类型", prop: "typeName", width: 220},
                {label: "文章编号", prop: "articleCode", width: 240},
                {label: "文章名称", prop: "articleName", minWidth: 300},
                {label: "封面图片", prop: "imagePath", width: 120, slot: true},
                {label: "点赞量", prop: "supportNum", width: 120},
                {label: "评论量", prop: "evaluateNum", width: 120},
                {label: "是否发布", prop: "releaseFlag", width: 80, slot: true},
                {label: "创建时间", prop: "createTime", width: 200}
            ],
            dataList: [],
            total: 0,
            param: {
                typeId: '',
                field: 'create_time',
                order: 'desc',
                pageSize: 20,
                pageNum: 1,
            },

            typeList: [],
            powerList: [],
        }
    },
    mounted() {
        this.getTypeList();
        this.$nextTick(() => {
            this.powerList = this.$common.getPowerList("newsArticle");
            this.height = (document.body.offsetHeight - 185) + "px";
        })
        this.searchList();
    },
    methods: {
        handleCurrentChange(val) {
            this.param.pageNum = val;
            this.loading = true;
            this.searchList();
        },
        resetData() {
            this.param.typeId = '';
            this.param.pageNum = 1;
            this.searchList();
        },
        getTypeList() {
            this.loading = true;
            this.$axios.post("/CHILD_SYSTEM/newsArticleType/getAllList", {
                leafFlag: 0
            }).then(res => {
                this.typeList = this.$common.getSelectList(res.data, "typeName", "id", true);
            }).finally(() => {
                this.loading = false;
            })
        },
        searchList() {
            this.loading = true;
            this.$axios.post("/CHILD_SYSTEM/newsArticle/getPageList", this.param).then(res => {
                this.total = res.data.total;
                this.dataList = res.data.rows;
            }).finally(() => {
                this.loading = false;
            })
        },
        editDetial(id) {
            this.id = id;
            this.showDetail = true;
        },
        editData(id) {
            this.id = id;
            this.showEdit = true;
        },
        delData(id) {
            this.loading = true;
            this.$axios.post("/CHILD_SYSTEM/newsArticle/delete/" + id).then(res => {
                this.searchList();
                this.$message.success(res.message);
            }).finally(() => {
                this.loading = false;
            })
        },
        releaseData(id) {
            this.loading = true;
            this.$axios.post("/CHILD_SYSTEM/newsArticle/release/" + id).then(res => {
                this.searchList();
                this.$message.success(res.message);
            }).finally(() => {
                this.loading = false;
            })
        },
        revokeData(id) {
            this.loading = true;
            this.$axios.post("/CHILD_SYSTEM/newsArticle/revoke/" + id).then(res => {
                this.searchList();
                this.$message.success(res.message);
            }).finally(() => {
                this.loading = false;
            })
        },
        editType() {
            this.$router.replace('/system/news/newsArticleType')
        },
    }
}
</script>

<style scoped>

</style>